<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>管理员注册</title>
    <link rel="stylesheet" href="./res/layui/css/layui.css">
    <style>
        *{
            border-radius: 0 !important;
        }
        .login-box{
            margin-top: 150px;
        }
        .login-panel{
            padding:10px;
            background: #fff;
        }
    </style>
</head>
<body class="layui-bg-gray">
<!--导航条-->
<ul class="layui-nav layui-bg-blue">
    <li class="layui-nav-item">
        <a href="#" class="layui-logo">
            <img src="./res/images/logo.png" height="80px" alt="">
        </a>
    </li>
</ul>

<!--登录/注册框-->
<div class="layui-container login-box">
    <div class="layui-row">
        <div class="layui-col-md4 layui-col-md-offset4 login-panel">
            <div class="layui-tab layui-tab-brief">
                <ul class="layui-tab-title">
                    <li class="layui-this">管理员注册</li>
                </ul>
                <div class="layui-tab-content">
                    <!--登录tab-->
                    <div class="layui-tab-item layui-show">
                        <form class="layui-form layui-form-pane" action="login">
                            <div class="layui-form-item">
                                <label  class="layui-form-label">
                                    <i class="layui-icon layui-icon-username"></i>
                                </label>
                                <div class="layui-input-block">
                                    <input type="text" name="username" class="layui-input" placeholder="请新建账号" required lay-verify="required" lay-vertype="tips" lay-reqtext="请输入账号">
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <label  class="layui-form-label">
                                    <i class="layui-icon layui-icon-password"></i>
                                </label>
                                <div class="layui-input-block">
                                    <input type="password" name="password" class="layui-input" placeholder="请输入密码" required lay-verify="required" lay-vertype="tips" lay-reqtext="请输入密码" autocomplete="off" lay-affix="eye">
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <button type="button" onclick="registerAdmin()" class="layui-btn layui-btn-normal layui-btn-fluid"  lay-submit lay-filter="formLogin">注册</button>

                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div style="text-align: center;margin-top: 10px;">@湖北商贸学院</div>
</div>

<script src="./res/layui/layui.js"></script>
<!-- add.html -->

<!-- add.html -->

<script>
    function registerAdmin() {
        // 从表单中获取数据
        var username = document.getElementById('username').value;
        var password = document.getElementById('password').value;

        // 创建一个对象来模拟Admin类的实例（在前端它只是一个普通的JavaScript对象）
        var adminData = {
            username: username,
            password: password // 注意：这里传递的是原始密码，加密将在服务器端进行
        };

        // 将对象转换为JSON字符串
        var jsonData = JSON.stringify(adminData);

        // 使用Fetch API发送POST请求
        fetch('/add', {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json' // 告诉服务器我们发送的是JSON数据
            },
            body: jsonData // 发送JSON字符串
        })
            .then(response => {
                if (!response.ok) {
                    throw new Error('Network response was not ok');
                }
                return response.json(); // 解析服务器返回的JSON数据
            })
            .then(data => {
                console.log(data); // 处理服务器返回的数据
                // 根据返回的数据，更新UI或显示消息
                if (data.code === 0) { // 假设R.ok()返回的是HTTP 200状态码和成功消息
                    alert('注册成功');
                    // 可以在这里清空表单或进行其他操作
                } else {
                    alert(data.message); // 显示错误消息
                }
            })
            .catch(error => {
                console.error('There was a problem with your fetch operation:', error);
                alert('注册失败，请重试');
            });
    }
</script>

<!--<script>-->
<!--    // 创建一个a元素-->
<!--    var link = document.createElement('a');-->
<!--    // 设置链接的文本-->
<!--    link.textContent = '点击返回登录界面';-->
<!--    // 设置链接的href属性-->
<!--    link.href = 'login.html';-->
<!--    // 可选：设置样式-->
<!--    link.style.textDecoration = 'none'; // 去除下划线-->
<!--    link.style.color = 'blue'; // 设置文字颜色-->

<!--    // 将链接添加到页面中的某个元素内，比如body-->
<!--    document.body.appendChild(link);-->

<!--    // 如果你想要将链接添加到特定的元素内，可以使用类似下面的代码-->
<!--    // 假设你有一个id为"myDiv"的div元素-->
<!--    // var container = document.getElementById('myDiv');-->
<!--    // container.appendChild(link);-->
<!--</script>-->

</body>
</html>